<template>
	<view class="reg_box">
		<view class="boxcent">
			<text>Account:</text><input type="text" v-model="account" placeholder="请输入账号"><br>
			<text>Password:</text><input type="password" v-model="password" placeholder="请输入密码">
			<text>UserName:</text><input type="text" v-model="supername" placeholder="请输入用户名">
			
			<view class="item">
				<br>
				<text>Type:</text>
				<view class="checkbox" style="margin: 15rpx;">
					<u-radio-group
					    v-model="radiovalue1"
					    placement="row"
					    @change="groupChange"
					  >
					    <u-radio
					      :customStyle="{marginBottom: '8px'}"
					      v-for="(item, index) in radiolist1"
					      :key="index"
					      :label="item.label"
					      :name="item.name"
					      @change="radioChange"
					    >
					    </u-radio>
					  </u-radio-group>
				</view>
			</view>
			<br>
			
			<!-- <button class="btn1" @click="login">注册</button> -->
			<u-button type="primary" @click="login"  text="注册"></u-button>
		</view>
	<view class="links">
		<view class="to">
			<navigator url="/pages/login/login">去登录</navigator>
		</view>
		
	</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				supername:"",
				account:'',password:'',list:{},
				 // 基本案列数据
				          radiolist1: [{
				            name: '0',
							label:"用户账号",
				            disabled: false
				          },
				            {
				              name: '1',
							  label:"店员账号",
				              disabled: false
				            },
				           
				          ],
				          // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				          radiovalue1: '',
			}
		},
		methods: {
			groupChange(n) {
			        console.log('groupChange', n);
			      },
			      radioChange(n) {
			        console.log('radioChange', n);
			      },
			
			async login(){
				var account = this.account;
				var password = this.password;
				// account.replace(/\s*/g,"")去除字符串内所有的空格
				if(account.replace(/\s*/g,"").length == 0){
					uni.showToast({
						icon:'error',
						position: 'bottom',
						title: '账号不能为空'
					})
				}else if(password.replace(/\s*/g,"").length ==0){
					uni.showToast({
						icon:'error',
						position: 'bottom',
						title: '密码不能为空'
					})
					
				}
				
				else if(this.supername ==""){
					uni.showToast({
						icon:'error',
						position: 'bottom',
						title: '用户名不可以为空'
					})
					
				}
				else if(this.radiovalue1==""){
					uni.showToast({
						icon:'error',
						position: 'bottom',
						title: '账号类型不可以为空'
					})
					
				}
				
				else{
					uni.request({
						url:'http://localhost:3000/super/reg',
						method:'POST',
						data:{account:account,password:password,supername:this.supername,user_type:this.radiovalue1 },
						success(res) {
							var result=res.data.data;
							console.log(result)
							if(res.data.code==200){
								
								uni.showToast({
									title: '注册成功'
								})
								
								
								
								uni.reLaunch({
									url:'/pages/login/login'
								})
							}else{
								
								uni.showToast({
									title:"注册失败"
								})
							}
						}
					})	
				}
			}
		}
	}
</script>

<style lang="scss">
	.reg_box{
		background-color: #f1f1f1;
		min-height: 100vh;
		overflow: hidden;
	}
	.links{
		margin: 55rpx;
		color: #23aaf2;
		letter-spacing: 4rpx;
		text-decoration: underline;
		font-weight: 500;
		font-size: 45rpx;
	}
	.boxcent{
		margin: 100rpx 50rpx;
		padding: 50rpx;
		box-sizing: border-box;
		background-color: #fff;
		border-radius: 20rpx;
		
		text{
			margin-left: 10px;
			font-size: 18px;
		}
		input{
			height: 40px;
			border-bottom: 1px solid #dbdbdb;  
		}
	}
	.btn1{
		margin-top: 50px;
		width: 60%;
	}
</style>
